<!--
 * Copyright 2006 Stephen Duncan Jr
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License. 
 * You may obtain a copy of the License at 
 * 	http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
-->

<html>
	<head>
		<title>High Card</title>
		
		<script type="text/javascript" src="cards.js"></script>

		<script type="text/javascript">
			function HighCard() {};
			
			HighCard.play = function play() {
				var result = {};
			
				var deck = new Deck();
					
				playerCard = deck.draw();
				dealerCard = deck.draw();
				
				result.playerCard = playerCard;
				result.dealerCard = dealerCard;
				
				var comparison = playerCard.compareTo(dealerCard);
			
				if(comparison < 0)
					result.message = "Sorry, you lose.";
				else if(comparison > 0)
					result.message = "You win!";
				else
					result.message = "It's a tie.";
					
				return result;
			}

			var playerCardTextNode;
			var dealerCardTextNode;
			var resultTextNode;
			var resultsElement;
		
			function play() {
				// Lazily initialize each of the elements
				if(!playerCardTextNode)
					playerCardTextNode = document.getElementById("playerCard").firstChild;
					
				if(!dealerCardTextNode)
					dealerCardTextNode = document.getElementById("dealerCard").firstChild;
					
				if(!resultTextNode)
					resultTextNode = document.getElementById("message").firstChild;
					
				if(!resultsElement)
					resultsElement = document.getElementById("results");
			
				// Play and get the result
				var result = HighCard.play();
				
				// Set the text of each of the elements to the corresponding result information
				playerCardTextNode.nodeValue = result.playerCard;
				dealerCardTextNode.nodeValue = result.dealerCard;
				resultTextNode.nodeValue = result.message;
			
				// Show the results element
				resultsElement.style.display = "";
			}
		</script>
	</head>
	
	<body>
		<h1>High Card</h1>
		
		<div>
			<div id="results" style="display:none;">
				You drew the <span id="playerCard" />.
				<br />
				Dealer drew the <span id="dealerCard" />.
				<br />
				<span id="message" />
				<br />
				<br />
			</div>
			
			Press "Play" to draw a card.
		</div>
		
		<form>
			<button type="button" onclick="play();">Play</button>
		</form>
	</body>
</html>